<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Smart Lock</title>
    <link rel="shortcut icon" href="static/16x16.ico" type="image/x-icon">
    <link rel="stylesheet" href="static/css/bootstrap.min.css">
    <link rel="stylesheet" href="static/css/bootstrap-theme.min.css">
    <script type="text/javascript" src="static/jquery-3.2.1.min.js"></script>
    <script type="text/javascript">
        $(function () {
            //开门
            $("#open").click(function () {
                $.get("open/lixin");
            });

            //灯全开
            $("#lightallon").click(function () {
                $.get("light/all/on");
            });
            $("#lightalloff").click(function () {
                $.get("light/all/off");
            });

            //门口灯
            $("#lightdooron").click(function () {
                $.get("light/door/on");
            });
            $("#lightdooroff").click(function () {
                $.get("light/door/off");
            });

            //卧室灯
            $("#lightbedroomon").click(function () {
                $.get("light/bedroom/on");
            });
            $("#lightbedroomoff").click(function () {
                $.get("light/bedroom/off");
            });

            //厅灯
            $("#lightliveon").click(function () {
                $.get("light/live/on");
            });
            $("#lightliveoff").click(function () {
                $.get("light/live/off");
            });
        });
    </script>
    <style type="text/css">
        input {
            width: 100%;
            height: 200px;
            font-size: 45px;
        }

        h1 {
            font-size: 60px;
            color: #ffffff;
        }

        div {
            padding-bottom: 50px;
        }

    </style>
</head>
<body style="background-color: #2b2b2b">
<h1></h1>

<div style="width: 100%;margin: 0 auto;" class="row">
    <input class="btn-lg btn-success" style="font-size: 45px;" type="button" id="open" value="开门"/>
</div>

<h1></h1>

<div style="width: 100%;margin: 0 auto;" class="row">
    <h1 class="text-center">@灯全开</h1>
    <input class="btn-lg btn-default" style="font-size: 45px;" type="button" id="lightallon" value="开 灯">
    <h1></h1>
    <input class="btn-lg btn-danger" style="font-size: 45px;" type="button" id="lightalloff" value="关 灯">
</div>
<h1></h1>

<div style="width: 100%;margin: 0 auto;" class="row">
    <h1 class="text-center">@卧室灯</h1>
    <input class="btn-lg btn-default" style="font-size: 45px;" type="button" id="lightbedroomon" value="开 灯">
    <h1></h1>
    <input class="btn-lg btn-danger" style="font-size: 45px;" type="button" id="lightbedroomoff" value="关 灯">
</div>

<div style="width: 100%;margin: 0 auto;" class="row">
    <h1 class="text-center">@厅灯</h1>
    <input class="btn-lg btn-default" style="font-size: 45px;" type="button" id="lightliveon" value="开 灯">
    <h1></h1>
    <input class="btn-lg btn-danger" style="font-size: 45px;" type="button" id="lightliveoff" value="关 灯">
</div>

<div style="width: 100%;margin: 0 auto;" class="row">
    <h1 class="text-center">@门口灯</h1>
    <input class="btn-lg btn-default" style="font-size: 45px;" type="button" id="lightdooron" value="开 灯">
    <h1></h1>
    <input class="btn-lg btn-danger" style="font-size: 45px;" type="button" id="lightdooroff" value="关 灯">
</div>


<h1></h1>

<p class="text-center text-info" style="font-size: 20px;">Copyright ©2017 Lixin</p>
</body>
</html>
